<template>
	<view class="contact">
		<image class="img" src="../../static/img/about_us.jpg"></image>
		<!-- <view class="info">
			<view @click="phone">服务热线：<text class="phone">13905085499</text></view>
			<view >客服咨询时间：9:00 - 17:30</view>
			<view>公司地址：福建省福州市鼓楼区软件园福建工程应用技术学院</view>
		</view> -->
		<u-cell-group>
			<u-cell-item icon="phone-fill" title="服务热线[点击拨打]" :arrow="false" :value="info.tel" @click="phone"></u-cell-item>
			<u-cell-item icon="qq-fill" title="QQ客服[点击联系]" :arrow="false" :value="info.qq" @click="qq"></u-cell-item>
			<u-cell-item icon="hourglass-half-fill" title="客服咨询时间" :arrow="false" value="9:00 - 17:30" @click="phone"></u-cell-item>
			<u-cell-item icon="email-fill" title="投稿邮箱" :arrow="false" :value="info.mail"></u-cell-item>
			<u-cell-item icon="map-fill" title="地址" :arrow="false" value="福建省福州市鼓楼区福建工程学院应用技术学院"></u-cell-item>

		</u-cell-group>
		
		<map name="" class="map" :scale="scale" :longitude="longitude" :latitude="latitude" :markers="markers" ></map>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				longitude:119.256642,
				latitude:26.108705,
				scale:13,
				markers:[
					{
						longitude:119.256642,
						latitude:26.108705,
						iconPath:'../../static/img/map_mark.png',
						width:30,
						heigh:30
					}
				],
				info:{}
			}
		},
		onLoad(){
			this.getInfo()
		},
		methods: {
			async getInfo(){
				const res = await this.$u.api.getContentInfo()
				this.info = res
			},
			qq(){
				// #ifdef H5
				this.$u.toast("抱歉！暂不支持WEB端跳转")
				// #endif
				// #ifndef H5
				plus.runtime.openURL('mqq://im/chat?chat_type=wpa&uin='+ this.info.qq +'&version=1&src_type=web ');
				// #endif
				
			},
			phone(){
				uni.makePhoneCall({
					phoneNumber:this.info.tel
				})
			}
		}
	}
</script>

<style lang="scss">
	.contact{
		.img{
			width: 750rpx;
			height: 320rpx;
		}
	}
	.info{
		padding: 10rpx 20rpx;
		font-size: 30rpx;
		view{
			line-height: 80rpx;
			border-bottom: 1px solid #eee;
			.phone{
				color: #FF9900;
				font-weight: 700;
			}
		}
	}
	.map{
		width: 750rpx;
		height: 500rpx;
	}
</style>
